<?php include '../public/header.php' ?>
<?php include '../public/header_index.php' ?>
<style>
    .minyuan_red{padding: 4px;background-color: red;border-radius: 50%;font-size: 0!important;margin-right: 6px;position: relative;top: -4px;}
    .minyuan_lv{padding: 4px;background-color: #19BE6B;border-radius: 50%;font-size: 0!important;margin-right: 6px;position: relative;top: -4px;}
    xm-select{min-height: 30px!important;line-height: 30px!important;}
    xm-select > .xm-label .xm-label-block{margin: 0!important;}
    xm-select > .xm-label .scroll .label-content{padding: 1px 10px!important;}
</style>
<body class="laytp-container">
<div id="opt_nav">
</div>

<div class="layui-card layui-hide" id="search-form">
    <div class="layui-card-body">
        <form class="layui-form" id="TableSearchFormId" lay-filter="TableSearchForm" onkeydown="keyTableSearch('TableSearchForm', 'datalist')">
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md3">
                        <div class="layui-form-item search-div">
                            <div class="layui-form-item layui-inline">
                                <input type="hidden" id="pid" name="pid" value="">
                                <button class="laytp-btn laytp-btn-md laytp-btn-primary" id="TableSearchButton" type="button"><i class="layui-icon layui-icon-search"></i>查询</button>
                                <button class="layui-btn layui-btn-primary" onclick="listTableReset()" id="TableSearchReset" type="reset" ><i class="layui-icon layui-icon-refresh"></i>重置</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="layui-card" id="table-card">
    <div class="layui-card-body">
        <div class="layui-row">
            <div class="layui-col-md2" id="navselect">
                <div class="navselect_div">
                    <div class="navselect_title">成本科目类别</div>
                    <div class="navselect_nav">
                        <a id="tree_pand" title="收起/展开">收起</i></a>&nbsp;
                        <a id="tree_search" title="刷新"><i class="layui-icon layui-icon-refresh-1"></i></a>
                    </div>
                </div>
                <div id="tree_content" style="padding-bottom: 20px"></div>
            </div>

            <div class="layui-col-md10" id="table_list">
                <div class="layui-card-body">
                    <table id="datalist" lay-filter="datalist"></table>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/html" id="test-dropdown-toolbar-barDemo">
    <div class="tab-list-authbut">
        {{# if(in_array('addson',currButAuthArr)){ }}
        <a href="javascript:;" class="bar_opt" onclick="auth_but_func_addson({{d.id}})">新建下级</a>
        {{# } }}
        {{# if(in_array('edit',currButAuthArr)){ }}
        <a href="javascript:;" class="bar_opt" onclick="auth_but_func_edit({{d.id}})">编辑</a>
        {{# } }}
        {{# if(in_array('edit',currButAuthArr)){ }}
        <a href="javascript:;" class="bar_opt" onclick="auth_but_func_move({{d.id}}, 1)">上移</a>
        {{# } }}
        {{# if(in_array('edit',currButAuthArr)){ }}
        <a href="javascript:;" class="bar_opt" onclick="auth_but_func_move({{d.id}}, 2)">下移</a>
        {{# } }}
        {{# if(in_array('delete',currButAuthArr)){ }}
        <a href="javascript:;" class="bar_opt" onclick="auth_but_func_delete({{d.id}})">删除</a>
        {{# } }}
    </div>
</script>
<script type="text/html" id="toolbarDemo">
    <div class = "layui-btn-container">
    </div>
</script>
<script>



    var currButAuth, currButAuthArr=[], currTabData, mytable, table, form, treeObj, deptTreeData=[], deptTreeStatus=1, sea_gangid='', sea_roleid='';
    layui.use(["tree", "laytp",'laypage','table','dropdown','form','soulTable'], function () {
        var tree = layui.tree,laypage = layui.laypage, table = layui.table, dropdown = layui.dropdown, form = layui.form, soulTable = layui.soulTable,treeTable=layui.treeTable;
        getDeptData();
        $("#tree_search").click(function () {
            getDeptData();
        });
        $('#tree_pand').click(function () {
            if(deptTreeStatus == 1){
                treeObj.reload({id: 'deptTree',data: opt_tree(deptTreeData, false)});
                deptTreeStatus = 2;
                $("#tree_pand").html('展开');
            }else{
                treeObj.reload({id: 'tree_content',data: opt_tree(deptTreeData, true)});
                deptTreeStatus = 1;
                $("#tree_pand").html('收起');
            }
        });
        function getDeptData() {
            facade.ajax({url: ask_engin_budsub_nav_list}).done(function(res){
                if (res.code === 2000) {
                    deptTreeData = res.data;
                    deptTreeStatus = 1;
                    $("#tree_pand").html('收起');
                    treeObj = tree.render({
                        elem: '#tree_content'
                        ,id: 'tree_content'
                        ,data: deptTreeData
                        ,onlyIconControl: true
                        ,click: function(obj){
                            $("#pid").val(obj.data.id)
                            searchTableFunc(form, table);

                            $('.layui-tree-entry').each(function () {
                                    $(this).find('.layui-tree-txt').removeClass('layui-tree-other');
                                });
                                $(obj.elem).find('.layui-tree-entry').eq(0).find('.layui-tree-txt').addClass('layui-tree-other');
                        }
                    });
                }
            });
        }


        setSouTableExport('成本科目', 2);
        $("#search_table").hide();
        mytable = treeTable.render({
            elem: "#datalist",
            id: "datalist",
            title: "成本科目",
            url: facade.url(ask_engin_budsub_list),
            where: {},
            page: true,
            height: 'full-140',
            soulSort: TabInit.soulSort,
            method: TabInit.method,
            toolbar: TabInit.toolbar,
            overflow: TabInit.overflow,
            defaultToolbar: TabInit.defaultToolbar,
            filter: TabInit.filter,
            request: TabInit.request,
            response: TabInit.response,
            contextmenu:get_table_contextmenu(soulTable)
            ,text: TabInit.text
            , tree: {
                iconIndex: 1        // 折叠图标显示在第几列
                , arrowType: 'arrow2'   // 自定义箭头风格
                , getIcon: function (d) {  // 自定义图标
                    // d是当前行的数据
                    if (d.children && d.children.length > 0) {  // 判断是否有子集
                        return '<i class="laytp-tree-icon laytp-tree-icon-folder"></i>';
                    } else {
                        return '<i class="laytp-tree-icon laytp-tree-icon-file"></i>';
                    }
                }
            }
            ,parseData: function (res) {
                currButAuth = res.data.butauth;
                for (var key in currButAuth ) {
                    currButAuthArr.push(currButAuth[key].butname);
                }
                tableButShow(currButAuth);

                $("#search_table").hide();

                return {
                    "code": res.code,
                    "msg": res.message,
                    "count": res.data.total,
                    "data": res.data.data
                };
            }
            , cols: [[
                {type: "checkbox", fixed: 'left'}
                ,{field: 'name', title: '名称',width:300}
                ,{field:'status',title:'启用状态',width:100,templet: function(d){
                        if(d.status > 0){
                            return '<span><span class="minyuan_lv"></span><span>正常</span></span>';
                        }else{
                            return '<span><span class="minyuan_red"></span><span>停用</span></span>';
                        }
                    }}
                ,{field: 'explain', title: '备注'}
                ,{field: 'updated_at', title: '最后更新',width:200}
                ,{fixed: 'right', title:'操作', toolbar: '#test-dropdown-toolbar-barDemo',align:'center',width:250}
            ]]
            , done: function (res) {
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
                mytable.expandAll();
            }
        });

        listTableSearch(form, table);
    });


    function auth_but_func_add(){
        var pid = $("#pid").val();
        if(!pid){
            facade.error("请选择左侧数据模块");return false;
        }
        openPageEdit('add.php?close=1&pid='+pid, '770px', '490px');
    }
    function auth_but_func_edit(id){
        openPageEdit('edit.php?close=1&id='+id, '770px', '490px');
    }
    function auth_but_func_addson(id){
        openPageEdit('addson.php?close=1&id='+id, '770px', '490px');
    }
    function auth_but_func_move(id, type){
        facade.ajax({url: ask_engin_budsub_move, data:{id:id,type:type}}).done(function(res){
            if (res.code === 2000) {
                layui.use(['table','form'], function () {
                    var table = layui.table,form = layui.form;
                    searchTableFunc(form, table);
                })
            }
        });
    }

    function auth_but_func_delete(id){
        data_delete(ask_engin_budsub_del, {id:id});
    }


    function opt_tree(data, status) {
        for (var i=0;i<data.length;i++){
            data[i]['spread'] = status;
            if(data[i].children != undefined){
                opt_tree(data[i].children, status);
            }
        }
        return data;
    }


    function searchTableFunc(form, table) {
        var data = form.val('TableSearchForm');
        mytable.reload('datalist', {
            where: data
        });
    }


</script>
</body>
</html>
